<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>课程编辑-管理员</title>
<link rel="stylesheet" href="${BasePath}/css/bootstrap.min.css">
<link rel="stylesheet" href="${BasePath}/css/bootstrap-pager.css">
<link rel="stylesheet" href="${BasePath}/css/bootstrap-switch.min.css">
<link rel="stylesheet" href="${BasePath}/css/common.css?v=${cssVersion}">
<style>
span{
margin:0 50px 0 0;
font-size: 14px;
}
</style>
</head>
<body>
	<div class="panel panel-default">
	    <div class="panel-heading">
	        <h3 class="panel-title"><strong>课程编辑（管理员）</strong></h3>
	    </div>
	    <div class="panel-body">
	        <#if teacher??>
	            <div class="form-group">
				    <label>教师信息</label>
				    &nbsp;&nbsp;${teacher.nickName}
				    &nbsp;&nbsp;&nbsp;&nbsp;${teacher.mobile}
				</div>
			</#if>
	        
	        <#if course??>
	            <div class="form-group">
				    <label>课程系列</label>&nbsp;&nbsp;${course.name!'无'}
				</div>
                <div class="form-group">
				    <label for="cTitle">课程标题</label>&nbsp;&nbsp;${course.title}
				</div>
				<div class="form-group">
				    <label for="cDesc">课程简介</label>&nbsp;&nbsp;${course.descr}
				</div>
				<!-- <div class="form-group">
				    <label for="cContent">课程内容</label>
				    <textarea id="cContent" class="form-control" rows="5" readonly>
				    ${(c.content)!''}
				    </textarea>
				</div> -->
				<div class="form-group">
				    <label for="cPrice">课程价格</label>&nbsp;&nbsp;${course.price}
				</div>
			    <div class="form-group" style="display: none;">
				    <label for="isFree">是否收费</label>&nbsp;&nbsp;
				    <#if course.isFree == 0>是
				    <#else>否
				    </#if>
				</div>
				<#if course.isFree == 1>
				<div class="form-group" style="width:400px;">
				    <label>课程类型</label>
				    <div class="input-group-btn">
					    <select class="form-control" id="freeTypeSelect">
					    <#if freeType == 0>
					    <option value="0" selected = "selected">好氧早读</option>
				        <option value="1">好氧读书会</option>
					    <#else>
					    <option value="0">好氧早读</option>
				        <option value="1" selected = "selected">好氧读书会</option>
					    </#if>
					    </select>
				    </div> 
			        <span class="input-group-btn">  
			            <button class="btn btn-primary saveFreeType">保存修改</button>  
			        </span>
				</div>
				</#if>
				<div class="form-group">
				    <label for="clickNum">点击次数</label>&nbsp;&nbsp;${course.clickNum}
				</div>
				<div class="form-group">
	            	<label>课程试听</label>
				    <audio src="${course.radioLink}" controls="controls" id="cAudio" style="vertical-align:middle;">
					</audio>
				</div>
				<div class="form-group">
	            	<label>课程置顶</label>&nbsp;&nbsp;
	            	<#if course.setTop == 1>
	            	<button class="btn btn-primary btnCancelTop">取消置顶</button>
	            	<#else>
	            	<button class="btn btn-primary btnTop">置顶课程</button>
	            	</#if>
				</div>
<!-- 				<button class="btn btn-primary btnUpdateCourse" class="float:right;">保存修改</button> -->
	        </#if>
	    </div>
	</div>

	<script type="text/javascript" src="${BasePath}/js/jquery-3.3.1.min.js"></script>  
	<script type="text/javascript" src="${BasePath}/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="${BasePath}/js/bootstrap-switch.min.js"></script>
	<script type="text/javascript" src="${BasePath}/js/ajaxHeader.js?v=${jsVersion}"></script>
	<script type="text/javascript">
	
	//取消置顶
	$(".btnCancelTop").click(function(){
		var ret = cancelSetTop('${course.id}');
		console.log(ret);
		var msg = ret ? '取消置顶成功' : '取消置顶失败';
		alert(msg);
		location.reload();
	});
	
	//置顶课程
	$(".btnTop").click(function(){
		var isFree = '${course.isFree}';
		var ret = null;
		var msg = null;
		if(isFree == '0'){
			msg = '置顶收费区';
			ret = setTop('${course.id}', false);
		}
		else{
			msg = '置顶免费区';
			ret = setTop('${course.id}', true);
		}
		msg += ret ? '成功' : '失败';
		alert(msg);
		location.reload();
	});

	//设置课程类型
	$(".saveFreeType").click(function(){
		var oldFreeType = '${freeType}';
		var newFreeType = $("#freeTypeSelect").val();
		var courseId = ${course.id};
		if(oldFreeType == newFreeType){
			alert("课程类型未改变");
		}
		else{
			var ret = setCourseType(courseId, newFreeType);
			var msg = ret ? '设置成功' : '设置失败';
			alert(msg);
			location.reload();
		}
	});
	
	function cancelSetTop(ids){
		var courseRequest = {
				ids: ids
		};
		var req = {requestData: JSON.stringify(courseRequest)};
		var ret = false;
		$.ajax({
			url: "${BasePath}/api/course/cancelTop",
			type:'POST',
			contentType : "application/json; charset=utf-8",
			data: JSON.stringify(req),
			dataType:'json',
			async: false,
			success:function (data) {
				console.log("data=" + JSON.stringify(data));
				if(data == null){
					console.log("没有数据");
					return;
				}
				ret = Boolean(data.responseData);
			}
		});
		return ret;
	}
	
	function setTop(ids, free){
		var courseRequest = {
				ids: ids
		};
		var url = '${BasePath}/api/course/setTopCharge';
		if(free == true){
			url = '${BasePath}/api/course/setTopFree';
		}
		var req = {requestData: JSON.stringify(courseRequest)};
		var ret = false;
		$.ajax({
			url: url,
			type:'POST',
			contentType : "application/json; charset=utf-8",
			data: JSON.stringify(req),
			dataType:'json',
			async: false,
			success:function (data) {
				console.log("data=" + JSON.stringify(data));
				if(data == null){
					console.log("没有数据");
					return;
				}
				ret = Boolean(data.responseData);
			}
		});
		return ret;
	}
	
	function setCourseType(courseId, freeType){
		var courseRequest = {
			id: courseId,
			courseType: freeType
		};
		var req = {requestData: JSON.stringify(courseRequest)};
		var ret = false;
		$.ajax({
			url: '${BasePath}/api/course/setType',
			type:'POST',
			contentType : "application/json; charset=utf-8",
			data: JSON.stringify(req),
			dataType:'json',
			async: false,
			success:function (data) {
				console.log("data=" + JSON.stringify(data));
				if(data == null){
					console.log("没有数据");
					return;
				}
				ret = Boolean(data.responseData);
			}
		});
		return ret;
	}
	
	</script>
</body>
</html>